<template>
  <component :is="currentTheme" v-if="currentTheme" />
</template>

<script setup>
import { ref, onMounted, watch } from 'vue';
import { useRoute, useRouter } from 'vue-router';
import Home from './Home.vue';
import ModernHome from './ModernHome.vue';

const route = useRoute();
const router = useRouter();
const currentTheme = ref(null);

const loadTheme = () => {
  const savedTheme = localStorage.getItem('theme') || 'classic';
  currentTheme.value = savedTheme === 'modern' ? ModernHome : Home;
};

onMounted(() => {
  loadTheme();
});

// 监听主题变化
watch(() => localStorage.getItem('theme'), (newTheme) => {
  loadTheme();
});
</script> 